<template>
  <div class='app-container'>
    <remote-script src="javascript/flow/traceobjectclass.js"></remote-script>
    <remote-script src="javascript/flow/trace.js"></remote-script>
    <remote-script src="javascript/flow/raphael-min.js"></remote-script>
    <remote-script src="javascript/flow/tracepathcontrol.js"></remote-script>
    <remote-script src="javascript/flow/json3.js"></remote-script>
    <el-button @click="gotoPage('/mes/produce/DetailsPlan?'+vueparams+'')" type='primary' size="mini">生产明细</el-button>
    <div class="form-unit">
      <span class="mvc-title-left">
        {{workName}}
      </span>
    </div>
    <el-form ref="form" :rules="rules" label-width="100px">
      <input id=functionName type=hidden name=functionName>
      <input id=pathInfo type=hidden value='' name=pathInfo>
      <input id=mainTableName type=hidden name=mainTableName>
      <input id=listTableName type=hidden name=listTableName>
    </el-form>
    <div id="svg"></div>
    <div id=altMsg scrolling="no" style="border:1px solid #000000 ;position: absolute; background-color: #FFFAE9; z-index: 200; font-size: 10pt; display: none"></div>
    <div id=oPopupMenu scrolling="no" style="position: absolute; z-index: 200; display: none"></div>
    <el-dialog :visible.sync="AddRecordProcessVisible" append-to-body>
      <AddRecordProcess v-if="AddRecordProcessVisible" ref="AddRecordProcess" :popparams="popparams"> </AddRecordProcess>
    </el-dialog>
  </div>
</template>
<script>
  import request from '@/utils/request'
  import AddRecordProcess from "@/views/mes/produce/flow/AddRecordProcess";
  export default {
    name: 'ProduceMonitoring',
    components: {
      AddRecordProcess,
    },
    props: ['popparams'],
    data() {
      return {
        AddRecordProcessVisible: false,
        AddRecordProcessValue: null,
        AddRecordProcessDesc: null,
        vueparams: this.getVUEParams(""),
        loading: false,
        rules: {}
      }
    },
    created() {
      this.getData();
    },
    updated() {},
    mounted() {},
    methods: {
      getData() {
        request({
          method: 'get',
          url: '/xcapi/VUEAction/mes/main/ProduceTraceability/produceMonitoring?' + this.vueparams,
        }).then(data => {
          for (var k in data) {
            if (Array.isArray(data[k])) {
              this[k] = data[k];
            } else {
              $.extend(this[k], data[k]);
            }
          }
          this.mvc.flowLoad(this.steps, this.skips);
          window.g_vue = this;
          for (var o in g_pathAry) {
            var emt = g_pathAry[o];
            emt.href = 'javascript:g_vue.popAddRecordProcess("&CMIDitem_work_id=' + emt.item_work_id + '")'
          }
          flowLoad();
        })
      },
      popAddRecordProcess(params) {
        if (params != "") this.popparams = params + this.vueparams;
        this.AddRecordProcessVisible = !this.AddRecordProcessVisible;
      },
    },
  }
</script>
